Hace un par de semanas estuve solucionando un problema en una plantilla Forte de BTemplates y me gustó la widebar, resulta útil cuando la sidebar se hace interminable.
Usuário Compulsivo a contribuido para que podamos añadirla explicando la forma de hacerlo. Así que vamos a seguir sus indicaciones, pero antes de empezar les sugiero que guarden copia de su plantilla.
Empezaremos descargando el archivo tabber.js que Usuario Compulsivo proporciona y lo alojamos en nuestro servidor.
Cuando lo tenemos alojado lo añadimos justo antes de </head> de esta forma:

<script type="text/javascript" src="url-archivo-tabber.js"></script>
Sustituyendo donde url-archivo-tabber.js por la url que nos proporciona nuestro servidor.

Si lo preferimos y es lo más recomendable lo alojamos en la misma plantilla igualmente justo antes de </head>

<script type='text/javascript'>
//<![CDATA[

/*==================================================
$Id: tabber.js,v 1.9 2006/04/27 20:51:51 pat Exp $
tabber.js by Patrick Fitzgerald pat@barelyfitz.com

Documentation can be found at the following URL:
http://www.barelyfitz.com/projects/tabber/

License (http://www.opensource.org/licenses/mit-license.php)
Copyright (c) 2006 Patrick Fitzgerald

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

==================================================*/

function tabberObj(argsObj)
{
var arg;
this.div = null;
this.classMain = "tabber";
this.classMainLive = "tabberlive";
this.classTab = "tabbertab";
this.classTabDefault = "tabbertabdefault";
this.classNav = "tabbernav";
this.classTabHide = "tabbertabhide";
this.classNavActive = "tabberactive";
this.titleElements = ['h2','h3','h4','h5','h6'];
this.titleElementsStripHTML = true;
this.removeTitle = true;
this.addLinkId = false;
this.linkIdFormat = '<tabberid>nav<tabnumberone>';
for (arg in argsObj) { this[arg] = argsObj[arg]; }
this.REclassMain = new RegExp('\\b' + this.classMain + '\\b', 'gi');
this.REclassMainLive = new RegExp('\\b' + this.classMainLive + '\\b', 'gi');
this.REclassTab = new RegExp('\\b' + this.classTab + '\\b', 'gi');
this.REclassTabDefault = new RegExp('\\b' + this.classTabDefault + '\\b', 'gi');
this.REclassTabHide = new RegExp('\\b' + this.classTabHide + '\\b', 'gi');
this.tabs = new Array();
if (this.div) {
this.init(this.div);
this.div = null;
}
}
tabberObj.prototype.init = function(e)
{
var
childNodes,
i, i2,
t,
defaultTab=0,
DOM_ul,
DOM_li,
DOM_a,
aId,
headingElement;
if (!document.getElementsByTagName) { return false; }
if (e.id) {
this.id = e.id;
}
this.tabs.length = 0;
childNodes = e.childNodes;
for(i=0; i < childNodes.length; i++) {
if(childNodes[i].className &&
childNodes[i].className.match(this.REclassTab)) {
t = new Object();
t.div = childNodes[i];
this.tabs[this.tabs.length] = t;
if (childNodes[i].className.match(this.REclassTabDefault)) {
defaultTab = this.tabs.length-1;
}
}
}
DOM_ul = document.createElement("ul");
DOM_ul.className = this.classNav;
for (i=0; i < this.tabs.length; i++) {
t = this.tabs[i];
t.headingText = t.div.title;
if (this.removeTitle) { t.div.title = ''; }
if (!t.headingText) {
for (i2=0; i2<this.titleElements.length; i2++) {
headingElement = t.div.getElementsByTagName(this.titleElements[i2])[0];
if (headingElement) {
t.headingText = headingElement.innerHTML;
if (this.titleElementsStripHTML) {
t.headingText.replace(/<br>/gi," ");
t.headingText = t.headingText.replace(/<[^>]+>/g,"");
}
break;
}
}
}

if (!t.headingText) {
t.headingText = i + 1;
}
DOM_li = document.createElement("li");
t.li = DOM_li;
DOM_a = document.createElement("a");
DOM_a.appendChild(document.createTextNode(t.headingText));
DOM_a.href = "javascript:void(null);";
DOM_a.title = t.headingText;
DOM_a.onclick = this.navClick;
DOM_a.tabber = this;
DOM_a.tabberIndex = i;
if (this.addLinkId && this.linkIdFormat) {
aId = this.linkIdFormat;
aId = aId.replace(/<tabberid>/gi, this.id);
aId = aId.replace(/<tabnumberzero>/gi, i);
aId = aId.replace(/<tabnumberone>/gi, i+1);
aId = aId.replace(/<tabtitle>/gi, t.headingText.replace(/[^a-zA-Z0-9\-]/gi, ''));
DOM_a.id = aId;
}
DOM_li.appendChild(DOM_a);
DOM_ul.appendChild(DOM_li);
}
e.insertBefore(DOM_ul, e.firstChild);
e.className = e.className.replace(this.REclassMain, this.classMainLive);
this.tabShow(defaultTab);
if (typeof this.onLoad == 'function') {
this.onLoad({tabber:this});
}
return this;
};
tabberObj.prototype.navClick = function(event)
{
var
rVal,
a,
self,
tabberIndex,
onClickArgs;
a = this;
if (!a.tabber) { return false; }
self = a.tabber;
tabberIndex = a.tabberIndex;
a.blur();
if (typeof self.onClick == 'function') {
onClickArgs = {'tabber':self, 'index':tabberIndex, 'event':event};
if (!event) { onClickArgs.event = window.event; }
rVal = self.onClick(onClickArgs);
if (rVal === false) { return false; }
}
self.tabShow(tabberIndex);
return false;
};
tabberObj.prototype.tabHideAll = function()
{
var i;
for (i = 0; i < this.tabs.length; i++) {
this.tabHide(i);
}
};
tabberObj.prototype.tabHide = function(tabberIndex)
{
var div;
if (!this.tabs[tabberIndex]) { return false; }
div = this.tabs[tabberIndex].div;
if (!div.className.match(this.REclassTabHide)) {
div.className += ' ' + this.classTabHide;
}
this.navClearActive(tabberIndex);
return this;
};
tabberObj.prototype.tabShow = function(tabberIndex)
{
var div;
if (!this.tabs[tabberIndex]) { return false; }
this.tabHideAll();
div = this.tabs[tabberIndex].div;
div.className = div.className.replace(this.REclassTabHide, '');
this.navSetActive(tabberIndex);
if (typeof this.onTabDisplay == 'function') {
this.onTabDisplay({'tabber':this, 'index':tabberIndex});
}
return this;
};
tabberObj.prototype.navSetActive = function(tabberIndex)
{
this.tabs[tabberIndex].li.className = this.classNavActive;
return this;
};
tabberObj.prototype.navClearActive = function(tabberIndex)
{
this.tabs[tabberIndex].li.className = '';
return this;
};
function tabberAutomatic(tabberArgs)
{
var
tempObj,
divs,
i;
if (!tabberArgs) { tabberArgs = {}; }
tempObj = new tabberObj(tabberArgs);
divs = document.getElementsByTagName("div");
for (i=0; i < divs.length; i++) {
if (divs[i].className &&
divs[i].className.match(tempObj.REclassMain)) {
tabberArgs.div = divs[i];
divs[i].tabber = new tabberObj(tabberArgs);
}
}
return this;
}
function tabberAutomaticOnLoad(tabberArgs)
{
var oldOnLoad;
if (!tabberArgs) { tabberArgs = {}; }
oldOnLoad = window.onload;
if (typeof window.onload != 'function') {
window.onload = function() {
tabberAutomatic(tabberArgs);
};
} else {
window.onload = function() {
oldOnLoad();
tabberAutomatic(tabberArgs);
};
}
}

if (typeof tabberOptions == 'undefined') {
tabberAutomaticOnLoad();
} else {
if (!tabberOptions['manualStartup']) {
tabberAutomaticOnLoad(tabberOptions);
}
}

//]]>
</script>
Guardamos los cambios y vamos a añadir los estilos de la widebar en la CSS. Justo antes de ]]></b:skin> añadimos lo siguiente:

/*--------Widetabt------------------*/
#tabsidebar-wrapper{width: 400px;float: right;border: 1px none #CCC;margin-bottom: 15px;}
.tabberlive .tabbertabhide {display:none;}
.tabber {display:none;}
.tabberlive {margin-top:1em;}
.tabber h2 {border-bottom:2px solid #5B0;margin-bottom: .3em;padding: 0;line-height:1.2em;}
.tabber .widget {margin-bottom: 1em;}
.tabber .widget-content {margin: 0 5px;}
ul.tabbernav{margin:0;padding: 8px 0;border-bottom: 1px solid #CCC;}
ul.tabbernav li{list-style: none;margin: 0;display: inline;}
ul.tabbernav li a{padding: 8px 0.5em;margin-right:2px;border: 1px solid #CCC;border-bottom: none;background: #EEE;text-decoration: none;}
ul.tabbernav li a:link { color:#369;}
ul.tabbernav li a:visited { color: #369;}
ul.tabbernav li a:hover{color:#00F; background: #CCC; border-color: #CCC;}
ul.tabbernav li.tabberactive a{background-color: #FFF;color: #369;border-bottom: 1px solid #FFF;}
ul.tabbernav li.tabberactive a:hover{color: #369;background: #FFF;border-bottom: 1px solid #FFF;}
.tabberlive .tabbertab {background: #FFF;padding:5px;border:1px solid #CCC;border-top:0;}
.tabberlive .tabbertab h2 {display:none;}
.tabberlive .tabbertab h3 {display:none;}

En el anterior código debemos hacer una pequeña modificación, se trata de sustituir 400px; por la medida exacta de nuestras dos columnas, #sidebar-wrapper y #newsidebar-wrapper lo podemos saber sumando los dos valores de width.
Por ejemplo:
#sidebar-wrapper {
width: 200px;

#newsidebar-wrapper {
width: 200px;

#tabsidebar-wrapper{
width: 400px;
Guardamos los cambios y marcamos para expandir la plantilla, ubicamos:
<div id='sidebar-wrapper'>

Y justo antes añadimos:

<div id='tabsidebar-wrapper'>
<div class='tabber' id='tab1'>
<div class='tabbertab'>
<b:section class='sidebar' id='tabbertab1' maxwidgets='1' showaddelement='yes'/>
</div>
<div class='tabbertab'>
<b:section class='sidebar' id='tabbertab2' maxwidgets='1' showaddelement='yes'/>
</div>
<div class='tabbertab'>
<b:section class='sidebar' id='tabbertab3' maxwidgets='1' showaddelement='yes'/>
</div>
</div></div><!-- Fim da tabsidebar-wrapper-->

Guardamos los cambios de nuevo y si todo ha salido bien veremos en plantilla de diseño lo siguiente:

Si en la sidebar ya tenemos elementos añadidos lo veremos de esta forma:

Lo que haremos ahora será incorporar los elementos dentro de las pestañas de la widebar.
clicamos sobre el número y arrastramos el elemento al lugar que hay disponible para ello.





Repetimos la operación de nuevo, esta vez clicamos sobre el número siguiente y arrastramos otro elemento hasta completar.





Cuando terminamos vemos que los elementos quedan ocultos, guardamos los cambios y es el momento de ver el resultado

En realidad es muy sencillo de aplicar, hay que prestar atención y modificar en el código la medida de nuestro #tabsidebar-wrapper que tenga la suma de #sidebar-wrapper y #newsidebar-wrapper a veces incluso mirando en vista previa tenemos que ajustar la medida.
También es conveniente que los títulos de los elementos no sean demasiado largos de lo contrario las pestañas se ocultarían por falta de espacio.
Y por último... probar antes en ese blog para experimentos que todos tenemos y hacer copia de la plantilla.
La personalización es posible respecto a colores y fondo podéis ver como hacerlo aquí.


Anónimo

Hola Gema

Quería consultarte dos cosas:
1- Cómo haces para que en la parte del footer, donde dice"Publicado por Gema" aparezca links a post relacionados.

2- Quería saber, por curiosidad, cómo haces para poner un color de fondo detrás de los códigos que proporcionas y para que los códigos están en letra roja.

Saludos.

Responder
mas de mi que de... lirio

Hola Gema, buen día.
A ver si tu me puedes ayudar…
He hecho la lista de blogs en el mio y no se que sucede con tu vinculo que no se actualiza.
A ver si puedes darme una mano!
Gracias y besos desde mi alma.

Responder
Anónimo

Hola gemita, una preguntica, ¿los meta tags son muy importantes para que un blog sea visitado?, es que tengo mi blogcito, que gracias a ti se a puesto bonito y, bueno, google lo indexo automáticamente y cuando coloco pensamiento jovenes en google aparezco ya en la segunda página, y cuando escribo pensamientosjovenes (pegadito) aparezco en la primera pagina, me parecio extraño, porque siendo un blog nuevecito esta en buenos lugares, al menos en google... jejeje

Responder
Gem@

Hola G los post relacionados los añadí siguiendo los pasos de J.Miur en esta entrada (En realidad son tres entradas sobre el mismo tema, lee las tres antes de modificar nada )
Sobre la forma de añadir una caja personalizada para los códigos puedes verlo aquí ;)

Más de mi... no tengo idea que puede ser, yo he probado a crear una lista de blogs ahora mismo y sale actualizada :(
En un principio pensé que quizás marcaste la casilla para ordenar alfabéticamente pero entonces saldrían los demás también :(
Comprueba que añadiste mi url correctamente, si aún así no se actualiza prueba a eliminarme (que mal suena jajaja ) y luego me añades de nuevo.

Responder
mas de mi que de... lirio

Gema, ya esta! Lo que pasaba era que agregue la u no se que jajajaja de tu perfil.
Gracias por todo y muchos besos desde mi alma.

Responder
Gem@

Me alegra que ya esté solucionado, ya me tienes controlada :)

Responder
Yola

Me viene de lujo esta entrada para no abusar de desplegables en mi sidebar.

Llevaba tiempo buscándola, sin buenos resultados, ahora mismo me voy a probar esta forma.

Muchas Gracias por todo Gema.

Responder
Anónimo

Disculpa que repita el comentario pero tengo rato entrando y no veo que me respondas :(

Aquí va de nuevo:

Hola gemita, una preguntica, ¿los meta tags son muy importantes para que un blog sea visitado?, es que tengo mi blogcito, que gracias a ti se a puesto bonito y, bueno, google lo indexo automáticamente y cuando coloco pensamiento jovenes en google aparezco ya en la segunda página, y cuando escribo pensamientosjovenes (pegadito) aparezco en la primera pagina, me parecio extraño, porque siendo un blog nuevecito esta en buenos lugares, al menos en google... jejeje

Responder
Gem@

LUIS BORGES si que son muy importantes ya que los metatags son de suma importancia para los navegadores.
Los metatags son etiquetas que incorporamos a la plantilla, y los robots al hacer un rastreo recogen los datos (metadatos) para incluirlos en los buscadores y luego mostrarlos en el resumen que podemos ver en los buscadores.

Responder
Gem@

Suerte Yola ;)

Responder
Anónimo

Thanks!

Responder
Admin

Hola gem@, esto no se parece al menú con botones que yo hice en Te Propongo? Me parece que la función es la misma aunque no se vea tan lindo como este, pero lo que yo tengo es mucho menos complicado de hacer.
Dime si me equivoco que la función es la misma por favor, tal vez estoy viendo mal, hasta creo que el enlace de ejemplo que pusiste no se ven las pestañitas.
Un besote guapa ;)

Responder
Gem@

Yo pienso que no k_nelita, porlo menos el efecto no es igual, el tuyo muestra una etiqueta y si clicas otra la despliega debajo.
Por lo que dices de difícil no lo es tanto, no hay que modificar nada si no se desea, lo único subir el archivo al servidor y el resto copiar y pegar.
Yo veo las pestañas pero a partir de esta tarde las he dejado de ver con IE, pero con Firefox las veo perfecto.

Responder
Admin

Si tienes razón, el efecto no es el mismo, a mi tampoco me gusta que despliegue el botón abajo.
Pero no dije que fuera difícil, sabes que me encantan los desafíos, dije complicado que no es lo mismo, hay que copiar un montón de código, que a veces me preocupa hacer tan grande la plantilla con tanto código, no le afecta en nada todo lo que le vamos agregando?

Otra cosa, vi la plantilla Forte y la de Usuario Compulsivo y son mucho mas anchas que la mía, es como si tuvieran una sidebar doble, yo tengo un monitor de 800 x 600 y no quiero hacerla mas ancha, ya que yo no la veo bien y me molesta que me aparezca la barra abajo para correrla.

Y... insisto con el ejemplo no se ven las pestañas y yo no uso IE, la estoy viendo con FireFox.
Gracias por el mail, todavía no he tenido tiempo de estudiar mas a fondo el asunto de las imagenes y sigo sin entender porque esas no las toma.
La que me diste de ejemplo no me gusta, no es solo por lo redondeada, no me importaría si no saliera la parte de abajo mientras salga la de arriba y no se repita, pero son esas las que me gustan, la otra solo es redondeada, es lo único que tiene en común.
Y otra cosa, que haces despierta a esta hora mujer?? :O Ja ja
Gracias por responder tan rápido.
Besotes ;)

Responder
Admin

Retiro lo dicho con respecto al ejemplo, ahora si lo veo sorry.
Retiro lo dicho sobre el tamaño de la sidebar, acabo de leer bien que se puede modificar el tamaño sorry again :( (es que tengo sueñoooo)

Besotes gem@ ;)

Responder
Gem@

jajajajaja eres la monda, y ahora te explico algo que me ha pasado, cuando me has dicho que no lo veías precisamente estaba añadiendo la widebar a un blog y comprobando que con IE no se veía, la sorpresa ha sido mayúscula porque J-Miur me dijo que mirara el script por si no lo tenía en una carpeta compartida.
¿y qué dirías? pues que lleva razón como siempre :)

El problema dela resolución de pantalla puede solucionarse k_nelita yo tengo puesta una resolución de 1.024 creo que era y se ve de fábula,con menor resolución te pierdes muchos detalles de las páginas pero eso es ya a gusto o necesidad de cada uno.

Lo de las imágenes te entiendo bien, la del ejemplo era sólo para que vieras una que si funcionaba.
Y estoy despierta porque como tu dices "ni modo" de coger el sueño :(
Besos amiga ;)

Responder
Admin

Hay gem@ no sabes el desastre que hice, menos mal que lo hice en blog de pruebas con la plantilla de Te Propongo, a ver si te puedo explicar algo... el main se me desplazó hacia abajo, arriba quedó la sidebar y al costado (donde estaba la sidebar) allí quedó lo de las pestañas, no se que mal hice, pero si que muuuucho!! :'-(
Si tenés tiempo miralo, está en el perfil, Pruebas.
De paso me fijé en el original (en el de pruebas tiene la plantilla original) de esa plantilla que si recuerdas tiene una imagen redondeada en la sidebar, redondeada arriba y abajo, si podés mirá el código fuente de como están colocadas las imagenes, sino igual te mando esa porción de código al correo para que la veas.
Besos!! ;)

Responder
Gem@

No es un desastre k:nelita, lo que ocurre que le diste más anchura al menú que a la sidebar.
Ve al código de los CSS del menú y donde pone tabsidebar-wrapper{width: 240px; cámbialo a 239px hasta quizás con un poco menos estaría mejor.
Ya sabes que los títulos en las pestañas las puede ocultar.
Lo que tiene la sidebar no es una imagen sino tres, es lo que te comentaba el otro día, que no es tan sencillo al menos para mi que no domino bien ese tema.
Si miras el código fuente o la plantilla verás que hay imágenes que no las añadiste tú sino que van con la plantillas.
Es un trabajo laborioso, hay que crearlas, que tengan la medida exacta, y buscar el lugar ideal para añadirlas.
He estado mirando otras alternativas, incluso le pregunté a J.Miur y a Pizcos que el diseño es lo suyo todos me derivan a una serie de páginas al estilo:
Nifty Corners
Y hay otra más sencilla como spiffycorners
Sigo en ello, si ves algo de interés me avisas ;)

Responder
Admin

No, no hay caso le puse 235 y sigue igual, y antes le había puesto 210 y lo mismo, hay otra cosa mal, no se que es :'-(

Lo de las imagenes ya había visto que estaba en tres partes, pensé que sabrías algo de eso, sino, no te hagas problema.

Besitos ;)

Responder
Gem@

Repasa el código k_nelita yo lo apliqué a un blog copiando el código de esta entrada.

Responder
Admin

Hola gem@, perdona si te escribo aquí pero sino me pierdo después no se donde escribí.
Lo de este código ya lo quité, al cabo que no me gusta tanto, ya encontré por aquí que tienes uno que me gusta mas, después me pongo a ver si me sale.
Lo que te quería decir es sobre las imagenes (si, el viejo tema), estuve investigando y en otra plantilla casi pude ponerlas, si, casi, me gustaría que le dieras una mirada al blog de pruebas, como allí tenían una imagen similar, dividida y todo, le puse la imagen mía, pero... se repite al final, pero si sale la parte final de la imagen.
Vos que sabés mas, o mejor dicho que sabés, tal vez te des cuenta que es lo que falta, porque si se puede poner en bloques en lugar de entera me da igual, lo digo porque se repite con principio y final.
Pero bueno tienes que verla para darte cuenta, es muy difícil explicarlo así.
Pasate por favor por Prueba está en mi perfil.
Besotes gemit@ ;)

Responder
Gem@

Prueba a suprimir el repeat-y eso hace que la imagen se repita, de todas formas yo creo que el error está en la imagen.
Si no se repite queda corta y los elementos se salen.
Si se repite se ve el angular de la esquina.
Lo ideal sería tres imágenes, una para el encabezado que no se repita, otra para el cuerpo que es la que se repite y la final que tampoco se repite.

Responder
Admin

Ya había probado en quitarle el repeat-y y también de reemplazarlo por no repeat pero nones.
No hay caso, voy a ver si hago una imagen para el centro como dices, que esa si se repita a ver que pasa, deseame suerte si?? ja ja :D

Responder
Admin

Bueno... te cuento, hice la imagen en tres partes, pero... en el blog de pruebas sale perfecto, la imagen toda completita pero al pasar el código (creo exacto) en FolkTango no se ve ni la parte de abajo ni la de arriba, todo lo demás si, ya no se que hacerle...:-'(
Dale una miradita a ver que opinas.
Besitos ;)

Responder
Gem@

¿Por qué no pruebas a añadir la imagen de arriba y de abajo en elementos de página ?

Responder
Admin

Nones, ni alineandola a derecha ni izquierda ni al centro, me queda de costado...
Probé solo con la de arriba pero sospecho que pasará lo mismo con la de abajo.
Y porqué si queda bien en el blog de pruebas??
Ya no entiendo mas nada... :(

Responder
Anónimo

Hola Gema, puede ser que este Widebar con pestañas no funcione por incompatibilidad con la plantilla , porque he hecho de todo y no hay forma de que se vea

Responder
Bear imaginario...!

hola gem@ muchas gracias tu blog es muy bueno, he encontrado cosas muy utiles, pero tengo un detalle, y es que he hecho todo a la medida tal cual lo dices en tu post, pero pues no me sale la widebar, :(

Responder
Bear imaginario...!

gem@ sos mi dios! gracias gracias gracias!!!! esta magnifico! se me habia olvidado subir el archivo jeje! te invito a visitar mi blog. http://blog-imaginario.blogspot.com me gustaria intercambiar links! solo si es de tu agrado claro esta!

saludos y gracias!

Responder
Gem@

K_nelita la explicación es sencilla, tu blog de pruebas no tiene la misma plantilla que el original, cualquier cosa que hagas no quiere decir que salga exactamente igual en las dos plantillas. Yo que tú me instalaba misma y entonces probaría y probaría.
¿Has modificado la imagen de larga?

Guti si el código estuviera mal ubicado aparecería e otro lugar, pero si no s eve nada lo más probable que sea el archivo del script.
(No he podido ver tu plantilla, si dejas la widebar añadida y me pasas la url del blog puedo ver que ocurre)

Me alegra que lo solucionaras Bear por supuesto te añado a mi grupo de amigos :)

Responder
Admin

Hola gem@, si he modificado la imagen de larga, por mas chica, por mas grande, de todo...
Ahora se ve mejor, pero igual no es lo que quiero.
Tienes razón, claro que el blog de pruebas no es la misma plantilla, pero justamente probé allí porque ese tiene una imagen similar con los bordes redondeados y dividida en tres, copié toda esa porción de código pero en la minima no funciona.
Igualmente como soy medio camikace, he hecho muchas pruebas en el blog original, mirando siempre en vista previa y copiando el código que había quitado, claro, para poder volverlo a poner en caso de necesidad.
Ahora saqué todo lo que había puesto del blog de pruebas y se ve mejor, pero ni la puedo dividir en bloques, ni ponerla toda entera... ya no se que hacer, voy a pasar por lo de Rosa a ver si se le ocurre algo.
Besitos y gracias por seguir preocupandote! ;)

Responder
Gem@

De todas formas si quieres mándame las tres imágenes, que con las tres no he probado yo ;)

Responder
Admin

Mandado mail con las tres imagenes y la que tengo ahora, a ver si puedes hacer algo, yo ya creo que agoté mis recursos :'-(

Besotes guapa ;)

Responder
Gem@

Marchando ;)

Responder
Ayzel-Ibz

pERDON...HAGO UNA PREGUNTITA...cComo subo el archivo .jss o una .css a blogger? gracias...

Responder
Gem@

Lili en Blogger no se pueden subir archivos js. :(
Mira esta
entrada que te puede ser de utilidad y te aclarará esa duda ;)

Responder
Unknown

Fantastico Gema! Me estaba liando con otros scripts pero este es mucho mas sencillo y modificable
Una cosa, no veo la manera de meterlo en otro sitio de la sidebar... siempre sale por defecto al inicio de la sidebar?
Gracias y saludos!

Responder
Gem@

La verdad no he probado Quique, pero el otro día lo añadí a una plantilla adaptada y luego añadí elementos de página nuevos (encima) de esta forma la widebar no la mueves pero los elementos los puedes arrastrar donde deseas.

Responder
Unknown

o sea que puedes mover los otros encima? ok! lo metere de nuevo y volvere a probar! gracias!

Responder
Ayzel-Ibz

Gracias, es lo que imagine....ya he ledo como vincularlas, espero que me salga todo bien.....gracias...

Responder
Gem@

No, Quique no, la Widebar contiene un <div> y no se puede incluir un <div> dentro de otro, lo que si se puede hacer es añadirla y luego sobre ella añadir nuevos elementos de página, una vez lo tienes añadidos entonces si puedes arrastrar los elementos de la sidebar pero la Widebar que fija.

Saudos Lili si tienes problemas me dices algo :)

Responder
Unknown

ya veo... asi que la widebar siempre quedara arriba. Lo estoy probando en un test e incluso intentandolo modificar en el template no puede pasarse al medio menu lateral
Gracias!

Responder
Gem@

No, no puede pasarse pero si puedes añadir elementos encima y el efecto sería el que deseas :)

Responder
Unknown

No lo consigo,

La sidebar se incia con esto:
div id='sidebar-wrapper'

Luego empieza la widebar con
div class='tabbertab'

Y cuando termina se abre la parte del menu lateral con:

b:section class='sidebar...

entonces pruebo de moverlos independientemente empezando por b:widget id pero me sale error...

si es muy liado dejalo que no quiero robar tu tiempo! :)

Por cierto, no te funciona el HP Print, me sale esto, parece que no debe dirigir bien a tu feed: Your request could not be processed

Responder
Admin

Hola gemit@!! Estoy contenta, finalmente lo he logrado!! Y yo solita ehh, como me imaginaba "nadie" me contestó la pregunta (ya sabes de que hablo), pero tanto fue el cántaro a la fuente... que logré mas o menos lo que quería, y si, mas o menos, nunca nada es perfecto, la parte de abajo de la imagen no sale, pero ya no me importa, logré dividirla en bloques y poner la imagen original que es gif y tiene mejor resolución, por así decirlo.
Ahora puedo dedicarme mas tranquila a seguir publicando, aunque como ya sabes, algo surgirá por ahí que se me ocurra ponerle ja ja.
Muchos besos gem@ y gracias por toda tu ayuda y preocupación, como vos no hay OTRA, ya te lo dije! Sos una GENIA!!
;)

Responder
Unknown

Hola Gema! finalmente he conseguido el mismo resultado con el script de solapas del maestro muir:
http://vagabundia.blogspot.com/2008/01/poner-el-contenido-en-diferentes.html

jugando un poco se puede crear el mismo efecto y meter tantas cuanto apetezca

Un saludo y gracias por todo!

Responder
Gem@

K_nelita corría ver como ha quedado y olvidé responderte aquí, me alegra mucho que lo consiguieras.
(Al final no sería mala idea crear ese blog que tanto te digo donde ir añadiendo las cosas que vamos aprendiendo)

Quique me alegra que lo resolvieras, quién mejor que J.Miur para solucionarlo ;)

Responder
DoN CeSaR

Saludos Gema, todo me funciona muy bien menos al buscar sidebar-wrapper' , pues en mi plantilla no lo tiene, intente ponerlo en widebar-wrapper', tambien en
sidebarright' y en
sidebarleft' y no me funciono, que podria hacer?? Muchas gracias, les quite los div pk me da error al comentar aqui

Responder
Gem@

DoN CeSaR no hay que intentar poner en cualquier lugar que nos acepte el código, hay un lugar indicado y es justo encima de la última columna. Me explico...

En la plantilla tenemos:

header-wrapper

main-wrapper

tabsidebar-wrapper

newsidebar-wrapper

sidebar-wrapper

footer-wrapper

el orden pueda que vaya alterado y sidebar-wrapper esté antes de newsidebar-wrapper pero ese es su lugar para añadir tabsidebar-wrapper "antes de las dos columnas"

(en la entrada añado un enlace a una imagen que te dará idea de lo que trato de explicarte)

Responder
DoN CeSaR

Gema muchas gracias, yo entiendo lo que tratas de explicar pero el problema es que yo no tengo ni sidebar wrapper ni newsidebar wrapper, tengo sidebarleft y sidebaright, por consiguente no tengo el div id sidebar wrapper, pero si tengo el #tabsidebar-wrapper... Sabes que no en todas las plantillas los codigos son lo mismo, me imagino que eso es lo que pasa en mi caso :( pero nada disculpa de todas maneras tantas molestias causadas. Gracias por tu ayuda

Responder
Gem@

Claro que no es lo mismo en todas las plantillas DoN CeSaR, tu estás utilizando la Scribe modificada y estas explicaciones son para la Minima.
Aún así se puede añadir la tabsidebar con pestañas.
Si en los estilos de tu plantilla viene sidebarleft y sidebaright sin más remedio debe existir <div id='sidebarleft'> y <div id='sidebarlight'>

Me dices que tienes #tabsidebar-wrapper ¿pero lo has añadido tú o ya estaba añadido con anterioridad? (yo no la veo en tu blog, ni en tu código fuente)
#tabsidebar-wrapper son los estilos DoN CeSaR donde modificamos el tamaño y color de las pestañas.
Lo que hay que intentar es añadir <div id='tabsidebar-wrapper'>
¿dónde? encima de las dos columnas, busca <div id='sidebarlight'> y <div id='sidebarleft'> una de las dos estará en primer lugar conforme vas subiendo la plantilla la que encuentres primero justo encima debes ubicar:
<div id='tabsidebar-wrapper'>
y todo el código que le sigue...
Si te gusta pero no puedes solucionarlo mándame la plantilla en archivo xml a mi correo que lo solucionemos ;)

Responder
DoN CeSaR

Yo se lo habia puesto lo que pasa es que lo quite, pero ahora volvi a intentar como me dijiste lo puse encima del primero div id sidebar que era el sidebarleft y me distorciona la pagina, te mandare la plantilla

Responder
Gem@

Si la distorsiona debe ser porque no modificaste antes la medida de #tabsidebar-wrapper,
De todas formas miro la plantilla y te comento algo...

Responder
Admin

Bueno aunque parezca mentira finalmente voy a postear en el lugar adecuado ja ja .D
Hice esto de la widebar, me ha quedado de maravilla, aunque sea difícil de creer, pero... quiero otra, se que se puede porque Pizcos tiene dos en su blog, le pregunté pero me dio un código que me tira error XML la plantilla, así que tuve que sacarlo.
A ver si vos podés ayudarme y decirme como pongo la otra, porque siempre la sidebar se me hace larguísima.

Besotes gemit@ ;)

Responder
Gem@

Hola k_nelita como te dije voy a probar en mi blog y te guío paso a paso ;)

Responder
Anónimo

Se ha suscitado un solo problema, no lo centralo :8

cambien todos los códigos, pero ni modo no logro hacerlo.

lo estos probando en mi blog de pruebas

Responder
Gem@

No veo la widebar en el blog Nav!´s :(

Responder
paqui

Gema, le puse en mi blog y funciona perfectamente, si puedes te pasas y me dices que tal.
Besicos paisa

Responder
Gem@

Quedó perfecta Paqui muy integrada al blog :)

Responder
paqui

Bueno despues de cambio aquí y allá con los colores quedo bien.
Gracias

Responder
Anónimo

Intente arreglarlo pero no funciono, ni idea que sucede :S

De todas formas gracias

Responder
Gem@

Nav!´s no he podido ver nada el perfil no está disponible :(

Responder
Patán

Gem@, lo probe y me quedó a la 1ª, ahora lo coloque en mi Blog y me gustó bastante.......

Le hice una renovación total y creo que que está mucho mejor que antes y estas cositas me han servido harto....

Saludos.

Responder
Unknown

Hola Gema, gracias a tu explicación mi tab ha quedado genial, muchas gracias :)

Muchos besos ronroneados

Responder
Gem@

Ha quedado genial Patricio, he seguido los cambios en el blog de Pizcos ;)
Buen cambio, ha ganado mucho.

Gracias a ti Pau por hacérmelo saber ;)

Responder
Patán

Gracias Gemita querida.....

Responder
Admin

Pero mira que bonitas letras le has puesto al formulario!! Ya vas a tener que contarme como hiciste eso ja ja

Bueno el tema que me trae es muy diferente, es con respecto a las tabs, mi Dios... intenté ponerlas en el mismísimo blog de pruebas, donde ya saqué el menú porque me pudo, me rindo, ya está, pero ahora quería ponerle esto, ya lo había intentado antes con identico resultado.

A ver si me das una manito, no se si explicarte o decirte que lo veas por vos misma, a ver... me desplaza la sidebar al centro de la página y se ubica al costado y los post por supuesto, abajo de todo...

Ultimamente nada me sale bien, seré yo , mi pc o que?? :'(

Responder
Gem@

Hay dos cosas muy importantes para añadir una widebar ya sea con o sin pestañas, una es que no debe ser mayor que la/s columnas, y otra que debe quedar siempre antes de la/s sidebar que tengamos. Normalmente debe ir justo antes de sidebar-wrapper pero o siempre nos da el resultado esperado mira esta imagen y te dará una idea de donde puedes ubicarla.
No sé si será la solución pero hay que intentarlo.
Donde widebar.wrapper puede ir la widetad

Responder
Gem@

Me olvidaba.... las letras las hice con Pikifx :)

Responder
Admin

Hola gem@, si era así como dices, la añadí en widebar.wrapper y ahí si sale mas o menos bien, dale una miradita, el problema es que se ve el fondo de la imagen que está debajo del lugar donde iría el título, hay que dificil de explicar, sería mejor que lo vieras vos misma y me digas.

Estuve mirando tu entrada de como personalizarla, porque así se ve bastante fea, no se si podrías darme una mano con eso, porque las medidas... bueno lo voy a estudiar mejor, pero mirala y decime si querés que te mande la plantilla.
Es bastante compleja esa plantilla...
prueba

Besoooo ;)

Responder
Admin

Algo hice y muuuuy mal porque no te puedo explicar como me quedó el panel, no puedo trabajar así.

Te mando una captura por mail para que veas.

Beso ;)

Responder
Gem@

He visto la captura knelita pero no la veo añadida :(

Responder
Anónimo

Hola Gema. Gracias por esta información, venía buscando algo así hace mucho tiempo.

Bueno, quería escribirte para pedirte ayuda con respecto a la apariencia de la widebar. Por favor me gustaría que pudieras ingresar al blog de pruebas donde estoy tratando de implementarla: BetaRD.blogspot.com, para que vieras algo.

La plantilla es la Insense, de Btemplates y, como verás, ya puse tres widebars: dos dentro de la sección de la sidebar, y una más por fuera y al final de la sidebar (nota: seguí tus indicaciones como lo expusiste en la entrada, y traté de poner una sobre la sidebar, pero no sé por qué, haciéndolo así, me despelotaba todo... jejejejeje, espero que se entienda la expresión :P).

Notarás también que he podido modificar algo de la apariencia de las widebars, pero tengo un problema con algo: si te fijas, la que está hasta abajo -por fuera de la sidebar- está como debiera estar, pero las que puse dentro de la sidebar, no registran todos los cambios que le he hecho al código css (paritularmente las pestañas que, como notarás, no parecieran tener ni márgenes, ni estilo, ni nada, e incluso se muestran como si estuvieran montadas en el resto del cuerpo de la widebar). Perdona que te moleste pidiéndonte estas cosas, pero si puedes echarle una mirada y ayudarme a cómo resolverlo, te estaré muy agradecido.

Mil gracias como siempre, Gema, eres un ángel.

Saludos.

Responder
Gem@

Hola Carlos Javier yo sólo veo una widebar al final de la sidebar, y un espacio vacío sobre ella ¿hiciste algún cambio después de este comentario?

Responder
Admin

Perdón por irrumpir :D estuve mirando el blog gem@ están las otras dos mas arriba pero no se nota porque no tienen las pestañas, son textos que hacen de enlace, como te dice Jorge no tiene estilos, si pinchas en ellos se abre la supuesta pestaña ja ja

Yo pensé lo mismo que vos hasta que lo estudié un poco mas :D

Soy como la mugre ja ja estoy en todos lados :D

Beso;)

Responder
Admin

Ja ja Jorge no, Carlos Javier, :D me equivoqué de atropellada :o

Responder
Gem@

Es cierto k_nelita eso son las pestañas que al no tener estilos parecen una widebar sin pestañas.
Carlos Javier mándame la plantilla porque el problema de los estilos en las dos widebar de arriba debe ser un error de la css.
Pero lo que me extraña es esa separación tan grande entre ellas.
Si puede se mándamela en archivo xml ;)

Gracias k_nelita eres un tesoro :)

Responder
Anónimo

Claro Gema, te mando la plantilla del blog: click para descargar.

Como te dije antes, las dos widebars que están dentro de la sección de la sidebar, no me aceptan los cambios en el diseño que la que está por fuera de la sidebar si. Supongo que el espacio grande que notas entre la tercera widebar y el resto de los widgets de la sidebar, tiene que ver justamente con eso, con que está por fuera de la sidebar. Tuve que hacerlo de esa manera (es decir, poniéndolas dentro o al finalizar la sidebar, pues haciéndolo como indicas en la entrada -antes de la sidebar- me desordenaba todo de una manera icomprensible).

No se si el problema esté precisamente en el css de la widebar, pues como verás, la que está hasta el final si me acepta los cambios que le he hecho... eso está muy raro.

Gema, perdona por abusar así de tu tiempo, desde ya te agradezco por tu ayuda... te repito, eres un ángel.

ah... y K_nelita, jejejejeje, no te preocupes... te agradezco mucho por haber ingresado al blog a revisarlo... chévere eso.

Responder
Gem@

Voy a instalarla en mi blog Carlos Javier si no me da tiempo hoy mañana te digo algo ;)

Responder
Anónimo

Gracias Gemita, estaré pendiente.

Un abrazo.

Responder
Gem@

Hola Carlos Javier.
Te explico el tema de tu plantilla...
La añadí a mi blog y eliminé las tres widebar, luego probé una y otra vez hasta conseguir algo más o menos aceptable pero sólo más o menos...
Tuve que prescindir de ls tercera widebar para poder hacer que desapareciera ese espacio vacío que las separaba.
Luego conseguí que una de las widebar quedara en la parte superior sobre el buscador pero esta opción desplazaba el espacio de las entradas.
Por último cuando conseguí que dos widebars quedaran en columna y aceptara la imagen de fondo además de las entradas en su sitio resulta lo que me comentabas que no admite los estilos.
Subsané un par de errores porque la clase de las widebar no puede repetirse y había dos id iguales pero aún así sigue sin admitir modificar el color de las pestañas.
Todo esto me hace pensar que el problema es la plantilla (adaptada para Blogger )
Normalmente cuando adaptan plantillas hay códigos que para Blogger se hacen inservibles pero como no alteran el funcionamiento de la plantilla se dejan ahí, esa idea me viene por el desplazamiento del main y porque yo e añadido hasta tres widebar con pestañas y dos widebar simples en una misma plantilla sin ningún problema.
¿Solución?
Cambiar de plantilla o consultar el problema con el autor que hizo la adaptación.
Si quieres que sigamos probando o consultar con otra persona me parece estupendo pero en mi opinión te va a dar muchos quebraderos de cabeza :(

Responder
Anónimo

Gracias Gema!!! :) Y si, el asunto está como complicado... de todas maneras lo tomaré como reto... algo debe haber, en algún lugar tiene que estar el chiste para hacer funcionar bien la apariencia de las pestañas de la widebar cuando están al interior del sidebar content.

Mil y mil gracias... lo sigo diciendo, eres un ángel, es muy valioso que te tomes el tiempo para ayudarnos... te mando un abrazo. Cualquier cosa lo seguimos charlando; si tengo una novedad al respecto te lo haré saber de una.

:)

Responder
Gem@

Cualquier cosa me pones al corriente Carlos Javier porque como bien dices es todo un reto ;)

Responder
Anónimo

Hola Gem@.

por fin me ha quedado bien, nunca pude hacerlo mientras usaba SkyDrive, solo con Geocities, parece mucho mas sencillo, veremos si funciona siempre bien!.

Muchas gracias por estos truquitos///

Responder
Gem@

Pues en Sky Drive es donde tengo todos los archivos js. Birdelo.
De todas formas si te funciona mejor el otro es bueno tener más de un alojamiento ;)

Responder
Anónimo

Hola Gema.

Te voy comentando algunas cositas: tal parece que hay un doble problema; por una parte, hay una línea del código css que es la que no permite que las pestañas de las widebars de mi blog de pruebas no acepten la apriencia que les quiero dar; y por otra, tal parece que hay un <)div(> mal cerrado en la plantilla, y eso es lo que ocasiona que cuando quiero poner una widebar por fuera de la side, se muestren esos molestos espacios en blanco.

Bueno... cuando lo tengo más claro todo te lo seguiré contando.

un abrazo!

Responder
Gem@

Yo tuve que eliminar un <div> para subir la widebar por eso te decía en otro comentario que cuando adaptan plantillas hay códigos que para Blogger se hacen inservibles pero como no alteran el funcionamiento de la plantilla se dejan ahí (no lo alteran hasta como en este caso vas a modificarla)
Como recibo tantas plantillas las voy eliminado, te digo esto porque ya no tengo la que me mandaste, como veo que a pesar de los inconvenientes quieres esta plantilla mándamela de nuevo y a ratos la iré probando ;)

Responder
Anónimo

Ok Gem@.

Mira, ahora he tenido una inquietud, ya que esto me ha gsuatdo mucho...

Quisiera saber si puedo ponerlo dos veces esta sidebar con pestañas. No se si es posible?.

Responder
Gem@

Posible si es Birdelo, si te fijas Pizcos las tiene añadidas, pero no basta con añadir el mismo código sino que tenemos que darle un nombre diferente.
Por ejemplo si añadimos la widebar con pestañas la llamamos #tabsidebar-wrapper{ a la segunda la podemos llamar #tabsidebar2-wrapper{
Luego también habría que añadir un id diferente donde añadimos div.

Responder
Anónimo

Gem@, voy a ver lo que hago, parece complicado o extraño no se?.

Gracias!!!.

Responder
Gem@

Birdelo es conveniente que antes pruebes en otro blog porque hasta que no guardas los cambios no ves el efecto.
Y no hay que olvidar que debe tener un nombre diferente porque no podemos añadir dos id iguales.
No sé si Pizcos explicó algo sobre añadir dos widewbar en todo caso el las tiene y puede orientarte sobre su plantilla ;)

Responder
Anónimo

Bueno...

Ya lo he logrado con ayuda de Dios, hehehe!.

Saludos y buenas noches...

Responder
Gem@

Vayaaaaaaaaaa que rápido :) :) :)

Responder
Anónimo

Así es!!!. Ya la mano se me esta flojando en esto de codigos, hehehe!.

Besos...

Responder
Anónimo

Hola Gema!!!

Pues bueno, resultó que la widebar, a punta de forzar el código css, pudo verse como yo quería; sin embargo, cuando pensé que todo estaba listo, caray... resultó que el IExplorer no me reconocía los dichos cambios. So... me quedé con la plantilla pero desistí de la widebar, y en su lugar opté por el truco sencillo de "mostrar y ocultar", el cual a la larga me parece que se allana mejor a lo que quería.

Te agradezco mucho por tu interés -desinteresado- (jejeje) en ayudarme. Espero que el agradecimiento público que he hecho en el foot de mi blog, compense en alguna medida tu útil colaboración.

Seguiremos charlando... saludos!!! :)

Responder
Gem@

Mi colaboración no ha sido nada Carlos Javier el interés si, pero sin resultados :(
De todas formas te agradezco el detalle y me gustaría sugerirte una cosa...
¿No te parecería mejor si a esos enlaces le eliminas el subrayado?

Responder
Anónimo

Claro que si, Gemita, tus recomendaciones son mas que bien recibidas; eso sí, tengo que preguntarte cómo puedo conseguirlo.

Y por el contrario, aunque no te parezca (cosa en la que estoy muy en desacuerdo), tu ayuda fue mucha y los resultados (por más y que no haya widebars con pestañas) están a la vista.

Un abrazo! :) :) :)

Responder
Gem@

Si lo quieres eliminar en todo el blog busca /* General Links */
Y donde dice:
a:hover { text-decoration : underline;
cambia a
a:hover { text-none : underline;

Si sólo quieres hacerlo en la sidebar busca:
#sidebar-wrapper li a:hover { text-decoration: underline;.......
Y la misma operación cambia underline a none ;)
Abrazos :) :) :)

Responder
Gem@

Disculpa, en la primera me confundí has de cambiar underline por none :(

Responder
Flores Literarias

mire la explicación de Jmiur para post relacionados q salen en el footer y te confieso no entendí NADA jajajaja pos gem@ precisamente por eso me encanta tu blog porque hablas sencillo y te entiendo... deberias hacernos el favorcito a nosotros, simples mortales, poner esta herramienta al alcance de nuestras manos...

gracias,,, mil gracias

Responder
Gem@

Flores Literarias apuntado está para próximas entradas ;)

Responder
Deybi

Hola de nuevo.

Gem@ me gustaría agregarla a mi plantilla de tres columnas. Pero no logro cuadrarla que quede justo encíma de las dos sidebars!.

Se pone solo encíma de una. Será repetir el código?.

Responder
Anónimo

Ay Gema!!
Trate de instarlo en mi blog y quedó horrible.. se desconfiguro, los números quedaron verticales y la sidebar se agrando!

No se que puedo hacer.. me gustaria que me aconsejaras :((

Porfis que me gustaría mucho tener una widebar :P

Responder
Gem@

Sidhe la sidebar se agranda porque no modificas el valor de width: 400px; que es el ancho de la caja.
Los números verticales quedan así si añades muchos piensa que esas medidas son para una sidebar grande añade menos porque luego esos números deben sustituirse por el texto de las pestañas.

Responder
Agos

Hola! Me encanta este blog, siempre consulto cosas para implementar a mi blog, pero hoy tengo un problema, subi una plantilla de blogskins, la edite y todo, todo esta bn, pero las entradas se fueron a un costado :S Alguien me puede ayudar?

Responder
Gem@

Agos ¿a qué blog te refieres? he visto que tienes varios.

Responder
FILÁ NOSOTRAS

Gema no se lo que hecho, esta la parte derecha del blog donde dice añadir un gadget de la parte derecha era uno solo yahora hay tres que me cruza todo el blog por detras, el blog se llama FILA NOSOTRAS

Responder
Gem@

Nosotras no entiendo bien lo que me dices ¿a la parte de detrás te refieres a la plantilla de diseño donde añadimos los gadgets y elementos de página?
Es que no veo en el blog las pestañas de la widebar :O
Miré en filanosotrasaspe y lomasnueve

Responder
FILÁ NOSOTRAS

el blog donde lo hice es http://filanosotrasaspe.blogspot.com/
y si, lo que te digo donde añadimos gadgets y elementos de pagina sabes que en cada sildebar pone añadir gadget pues en la parte de la derecha se pueden poner 3 gadegts pero ademas me cruza todo el blog por detras, un saludo

Responder
Gem@

Eso es porque la widebar no la añadiste sobre la sidebar .
Lo ideal sería eliminar los cambios y dejarlo como antes, de no recordar los cambios y si tienes una copia de la plantilla sustitúyela por la que tienes ahora.

Responder
Luxuria

Hola gema. Sigo arreglando el blog que con la plantilla que tenía me era muy difícil encontrar los códigos así que he decidido empezar de cero en otro blog con la mínima y ahora es mucho más facil, pero las cosas con scripts no me sale: ni el slider ni esto. Sigo todos los pasos, los reviso y todo parece ir bien y al final como si no hubiese añadido nada. ¿Hay alguna forma de solucionar esto? sobretodo lo del slider me encantó.

Por cierto, lo que te comenté el otro día que en explorer no se veían las transparencias, al día siguiente ya se veía. Misterios de la vida:O

Responder
Gem@

Luxuria si me dices a qué blog te refieres miro por si viera donde está el error :)

Responder
Anónimo

Hola. Tengo instalada la plantilla revolution para blogger. En el blog de pruebas he instalado la widebar, siguiendo tus consejos, y funciona todo correctamente, salvo que la misma se posiciona encima de las dos sidebars sin llegar a alinearse con la sidebar izquierda.

Creo que se debe a un problema con el padding y el margin, pero no he conseguido centrarla. te dejo la dirección del blog por si fueras tan ambable de ofrecerme una solución. un cordial saludo.

http://pruebaiuris.blogspot.com/

Responder
Gem@

iuriscivilis la widebar que añadiste no es la esta entrada te lo digo por si te has confundido, de todas formas prueba a darle menos anchura da la sensación que sobra espacio.

Responder
Anónimo

Te agradezco la respuesta, en cuanto disponga de algo de tiempo intentaré seguir tu consejo y disculpa la confusión. Gracias por la ayuda que prestas en este magnífico blog a todos aquellos blogueros inexpertos en el diseño de sus bitácoras. Un cordial saludo.

Responder
Gem@

Suerte iuriscivilis :)

Responder
Admin

Hola gemit@ tanto tiempo sin comentar en tu blog! Pero lo leo ehh, de vez en cuando hago una pasadita y veo las novedades de los amigos.
Pero ahora viendo en el correo este tema al que estoy suscripta me acordé que nunca pude implementar la Widebar en Te Propongo, pero si en FolkTango, porque es una Mínima, y se me había olvidado comentarte que con IE se ven ensimadas las pestañas, eso se me olvida siempre ya que como no lo uso... solo de vez en cuando le doy una mirada a ver como se ven los blogs.
Habrá alguna forma de corregirlo? Vos como lo vez con IE? Con FF perfecto!
Muchos besitos gem@ ;)

Responder
Gem@

k_nelita que bueno verte por aquí!!
Yo veo las pestañas perfectas con los dos mira aquí esta prueba de IE8

Responder
Abel3D

Hola, tengo un problema, al poner un gadget solo lo puedo poner en el unico lugar que me deja, una vez puesto ahi no me da opcion a escoger uno de los numeros, tampoco vuelve a salir un espacio vacio para agregar gadgets debajo de los numeros, como puedo poner gadget asignados a cada numero???, saludo.

Responder
Gem@

yz Hola Abel3D la única forma es como ves explicado y funciona bien, lo más probable que tengas algún error pero no he podido acceder a tu blog para verlo. Repasa los pasos desde el principio para asegurarte que todo está en su lugar ;)

Responder
paqui

no se que paso con mi comentario

Responder
paqui

Lo pongo de nuevo
Gema, en mi caso solo me quedaría insertar en la plantilla el código del archivo.js, lo pondría en lugar del tengo el script, es así o estoy confundida..
Me da yuyu eso de tocar plantilla..
Besicos..

Responder
Gem@

yz Paqui así es, eliminas el que tienes que contiene la url del código y añades el que ahora he subido a esta entrada.
Antes de hacerlo haz una copia de la plantilla, como ya tienes los estilos añadidos puedes ver los cambios en vista previa ;)

Responder
paqui

Lo intentaré Gema pero me da cosa tocar plantilla...
mil gracias...

Responder
Gem@

yz Suerte Paqui :)

Responder
ConstrucArq.

Hola, quizas se este duplicando mi pregunta lo que pasa es que envie y parece que se me corto el internet, bueno tengo algo parecido a lo que explicas, en mi blog puedes ver que trato que se parezca mas a una web pero no se como hacer que la pestaña por ejemplo portafolio salga solo al lado derecho las etiquetas, y por ejemplo si me voy a la pestaña servicios ya no me salga al lado derecho la setiquetas sino me salga por ejemplo musica se puede hacer?? te envio mi blo para que entiendas mejor. desde ya muchas gracias y felicitaciones por tu blog esta muy bueno. www.construcarq20.blogspot.com

jeshus911@hotmail.com
jesus

Responder
Gem@

yz ConstrucArq. creo que la url está equivocada porque me dice que no existe :O

Responder
ConstrucArq.

Hola, gracias por rsponderme, mira el problema lo solucione al final de otra manera, ando ya dias armando esto y ante mis limitaciones voy viendo como ajustarlo, mi web es www.construcarq.blogspot.com alli lo que busco es que donde dice interior hay una cortina donde elijo por ejemplo sala 02 y si bien la imagen que esta a la izquierda cambia el nombre de la etiqueta que seleccione no lo hace y esto da una sensacion de equivocacion para el que use ya que sale siempre cocina al final y no el nombre que seleccione espero me puedas ayudar con esto ...gracias
jesus

Responder
Gem@

yz ConstrucArq lo que ocurre que cada vez que seleccionas un texto te envía al sitio indicado pero luego el texto es siempre el mismo, eso es porque donde añadiste COCINA 01 es el espacio destinado al título.
El desplegable trabaja de forma que nos muestra siempre un título por ejemplo "Cocinas" y al desplegarse muestra la cocina que marcamos.
¿Solución? en lugar de Cocina 01 añade INTERIORES o... crea un desplegable para cada compartimiento de la casa Cocinas, Salones, Baños, Dormitorios... es una forma de organizarlo y que las visitas localicen fácilmente lo que están buscando.
No sé si se entiende mi idea :O

Responder
ConstrucArq.

hola vuelvo a escribir veo que no se publica mi comentario, bueno hare como mi indicas, tengo 2 consultas como hacer para que cuando seleccione un nombre (ejemplo cocmedor 01) este se quede en la cortina con ese nombre para que el que visite la web vea que ese nombre indica lo que muestra l aimagen, ya que siempre vuelve a decir cocina 01 y eso confunde.. y lo segundo sabes como podria modificar el tamaño del texto de la etiqueta (cocina 01, sala etc) gracias

Responder
Gem@

yz Ese texto (que permanece en la cortina) pertenece al título, cada vez que hacemos click nos muestra la página que escogemos y automáticamente regresa al punto de partida. Hasta donde yo sé no hay otra forma de hacerlo.
Pueden buscarse alguna idea para que se muestre en la parte inferior de la imagen un texto con el título de la imagen y las visitas sepan así donde se encuentran, hay scrips muy vistosos que para nada ocultan la imagen al mostrar el texto.

Para modificar el tamaño del texto, color .... mira esta entrada que te indica como crear el desplegable y añadirle estilos.
http://gemablog-.blogspot.com/2007/12/etiquetas-en-despleglable.html

Responder
Soliloquios por Doquier

buenos dias señorita, en realidad me parecio excelente su post, aunke todavia no lo he aplicado, por motivos de mejor de mi blog y estoy esperando para atualizarlo por completo, y queria saber com se hace para colocarla info que sale al final de su blog, que sale su fotografia y una breve descripcion,si me podria ayudar, mi correo es lamcast@hotmail.com y mi blog www.subliminalshop.blogspot.com

Responder
Gem@

yz Subliminal Shop ese espacio está incluido en el footer de la plantilla con gadgets que añadimos desde elementos de página.
Lo primero que hay que hacer es acondicionar el footer del blog, puede seguir los pasos indicados en el siguiente enlace.

Responder
ConstrucArq.

Hola Gem, gracias con tu ayuda pude modificar el tamaño de mi texto ahora se ve mejor... Tu ayuda es muy valiosa..saludos.

Jesus

Responder
ConstrucArq.

Hola, podrias ayudarme a separar los sidebar de esta pagina http://www.construcarqpor.blogspot.com/
por ejemplo quiero separar la barra de flash con el desplegable, como veras se ven que estan pegados y lo que quiero lograr es que se vea la separacion tal como lo hice en la pestaña Nosotros..aunque intente poner la misma separacion para el caso que quiero lograr separar no puedo..espero tu ayuda gracias de antemano. saludos Jesus

Responder
Gem@

yz Hay una forma de solucionarlo muy fácil, editas el gadget donde añadiste la barra de flash y al final añades <br>
Eso produce un salto de línea, puedes añadirlo tantas veces quieras.
(Me encanta como está quedando la web)

Responder
ConstrucArq.

Hola, antes que nada dobles gracias tanto por tu ayuda como por tu comentario de mi web...hice lo que me dijiste añadi en el gadget de flash el
pero cuando inserto uno solo no hace ningun cambio y cuando pongo 2 veces (

) se salta pero demasiado asi como puedes ver en portafolio....lo que quiero es que sea un solo salto y no puedo...tambien si ves despues del despegable estan esas imagenes movidas pero entre ellas hay mucho espacio quiero que todo tenga la separacion que se puede ver en la pestaña Nosotros, espero me entiendas...gracias como siempre que sin tu ayuda esto hace rato lo hubiera abandonado saludos.
Jesús.
www.construcarqpor.blogspot.com

ahora como veras esta el flash con 2 br y por eso se ve tanta separacion, probe con 1 br y no modifica nada.

Responder
Gem@

yz ConstrucArq yo creo que eso lo solucionarías inluyendo los dos códigos en un mismo gadget, el del archivo flash y el desplegable. De esa forma la etiqueta br para separarlos causará efecto porque al ser el distintos gadget por defecto añade la separación.

Responder
Unknown

Hola Gema estoy montando un blog y he colocado la Widebar sin ningun problema he ampliado pestaña y funciona correctamente, el problema esta cuando dejo la pagina principal y accedo a traves de las etiquetas (Ej.Cronica Veterans)a otra pagina la widebar se queda en su lugar pero la sidebar se desplaza debajo de las entradas, he modificado el ancho de la widebar y no funciona ¿existe algun sistema para que no se desplace la sidebar?, te adjunto la direccion del blog: http://17noublog130.blogspot.com/ Gracias

Responder
Gem@

yz 17130lescalaesport aparentemente parece que lo que interfiere es el scroll de "marcador" prueba a eliminarlo provisionalmente, si ves que fuera eso intenta añadirlo con menos anchura.

Responder
Unknown

Gema muchas gracias por responder tan rapido, he modificado la anchura del scroll pero continua haciendo lo mismo, creo que el problema esta en la altura de las pestañas cuando se abren, si es mayor que el espacio que ocupa el main la sidebar se coloca debajo del main pero al desplegar una de las entradas la sidebar vuelve a su sitio,pues la altura de la entrada es superior a la de la widebar, creo que voy a reducir la altura de la widebar con scroll y cuando tenga mas entradas ampliar la widebar.Repito Gracias

Responder
:::CRISTOADICTO:::

Esto era lo que buscaba, lo agregue a un blog de pruebas sin mayor dificultad. Gracias.

Te envie un mail por lo del buscador, espero llegue.

Nos vemos

Responder
Gem@

yz No hay de qué 17130lescalaesport, espero lo soluciones :)

yz CRISTOADICTO voy a buscarlo ;)

Responder
Anónimo

hola Gemit@, estoy intentando ubicar el post donde explicas como poner el listado de los titulos de las entradas en vez de q se muestre todo el post pero no lo encuentro. :$

agradezco una ayudita, gracias.

F.L

Responder
Shavy

Hola Gema,

Ese truco ya lo implementé en una plantilla que modifiqué, pero estoy modificando otra, instalo todo tal cual ya lo he hecho, incluso se ven los "añadir gadget", pero en la visualización no aparece la widebar, y se que esta todo ok, el tabber bien alojado y todo, me ayudas xfa.

la plantilla la encuentras Aquí, me valí del salvavidas XooImage.

Serías tan cariñosa de ayudarme en este detalle xfavor, es que realmente me ha dolido la cabeza con esto y no se la razón del error.

BENDICIONES
Shavy

Responder
Gem@

yz Hola Shavy no puedo descargarme archivos en este PC si no tienes mucha prisa mándame mejor el archivo xml de la plantilla y la semana que viene cuando esté en el otro PC lo miro.
Si lo solucionas házmelo saber por favor :)

Responder
Shavy

OK Gema, don´t worry, puedo esperar con tal de encontrar la solución. Pero gracias de todos modos, te envio el xml a forevergema y cuando puedas me sacas de esta.

Nos leemos Gema, y gracias.

BENDICIONES
Shavy

Responder
interferencia

hola gema!!! he estado echando un vistazo a tu blog y quizás tu me puedes ayudar: tengo un blog con blogger y me he bajado una plantilla. La he instalado correctamente y la he ajustado al diseño que tenía, pero me he dado cuenta que la plantilla que me he bajado tiene "pestañas".
¿Cómo puedo hacer que, con hacer click sobre un pestaña, me aparezca la informacion?
Por ejemplo: tengo una pestaña que pone " fotos", pue sme gustaria que al hacer click ahi apareciesen fotos que vaya a subir.
No se si me he explicado, es que esto de internet se me da fatal...
MUCHAS GRACIAS!!!!!!!!!!!!!!!!

Responder
Gem@

:: Saludos interferencia, el menú lo tienes que configurar desde la plantilla edición de html.
Busca donde dice:
<div id="header-wrapper">
un poco más abajo a partir de <ul id="menu"> es donde debes añadir los enlaces. Por ejemplo en <a title="" href="#" accesskey="3">Fotos</a> debes sustituir en " href="#" la almohadilla por la url donde se encuentran las fotos :)

Responder
Bilosony2™

hOla!! Gem@ Tengo una duda como aria si quisiera colocarlo arriva del cuerpo de las entradas arriba del main...

saludos!!:D

Responder
Gem@

:: Como cualquier gadget Bilosony2™ editando un nuevo gadget de html sobre el main o arrastrando el gadget :)

Responder
Bilosony2™

hola!! Gem@ tengo un gran problema lo intentado aplicar al pie de la letra y no hhay caso no pasa nada ni siquiera descargando plantillas que lla lo traen instalados sera problema de blogger???

Responder
Gem@

:: Bilosony2™ si que es extraño que ni las que lo llevan instalado te funcione ¿no lo ves en plantilla de diseño?
Lo ideal en estos caso es instalarlo en un blog de pruebas, coge una plantilla Minima y sigue paso a paso lo indicado verás como si te resulta.

Responder
Bilosony2™

Hola!! Gem@... Al parecer era problema de blogger pero hasta que el problema se soluciono yo segui metiendo cuerda para ver que era lo que probocaba que no se viera y al final no encontre que fue lo que lo proboco :-I Pero despues de unos dias magicamente se enpeso a ver :S Me resultaba dificil creer que aya sido problema de mi plantilla ya que es una plantilla minima de blogger que la e modificado con tanto cuidado de no meter ningun scrip malisioso ni tanpoco tener problemas con las propiedades css, ademas no solo en mi plantilla no se veia tambien pasaba con las plantillas que ya lo traian instalado. Pero bue ahora magicamente anda y fue donde le enpece a meter mano para que quede un toke mas elegante jeje :D

Gracias!!!!!:)

Puedes pasar a verlo http://pintagraff.blogspot.com/ ;)

Responder
Gem@

:: Me alegra mucho que al final esté resuelto Bilosony2™ este Blogger es un misterio :)

Responder
Anónimo

Un saludo Gema!
Tengo un problemilla con este truco, lo primero q hice fue colocar todo como lo indicas. Primero lo hice con el scrip que tu pones y luego con el del archivo descargable y me da el mismo resultado.
Las pestañas se ven exelentes en la web, el problema es q en "elementos de página" no se ven los números y aparecen unas rayas grises sobre el espacio de las entradas, aqui te dejo la foto para q veas
http://img443.imageshack.us/img443/2500/pestanias.jpg

Cuál crees q sea el problema? Es extraño ya que el resultado final si es el correcto y aqui lo puedes ver
http://img85.imageshack.us/img85/5816/ejm1.jpg

Espero tu pronta respuesta.
Gracias de antemano,

Responder
Gem@

:: No sabría decirte ahora mismo Camino Ninja, pero si se ve bien cosa que he comprobado mejor déjalo como está ;) muchas veces intentando mejorar algo lo que conseguimos es empeorarlo.
Miraré tu código fuente por si veo algo :)

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top